<template>
  <div class="App">
    <Item
      title="美食"
      :list="[
        { id: '001', content: '螺蛳粉' },
        { id: '002', content: '卤煮' },
        { id: '003', content: '豆汁' },
      ]"
    />

    <Item
      title="游戏"
      :list="[
        { id: '001', content: 'DNF' },
        { id: '002', content: 'CF' },
        { id: '003', content: 'LOL' },
      ]"
    />

    <Item
      title="音乐"
      :list="[
        { id: '001', content: '民谣' },
        { id: '002', content: '爵士' },
        { id: '003', content: '古典' },
      ]"
    />
  </div>
</template>

<script>
import Item from "./components/Item";
export default {
  name: "App",
  components: {
    Item,
  },
};
</script>

<style scoped>
.App {
  display: flex;
  justify-content: space-around;
}
</style>
